<template>
<div class="container">
    <div class="page-head">
        <div class="left">
            <el-form :inline="true" :model="query" @submit.native.prevent>
                <el-form-item>
                    <picker-view type="user" :multiple="true" v-model="query.user_id" placeholder="发起人"></picker-view>
                </el-form-item>
                <el-form-item>
                    <picker-view type="company" v-model="query.company_id" ::multiple="true" placeholder="签约公司"></picker-view>
                </el-form-item>
                <el-form-item>
                    <picker-view v-model="query.audit_type" type="timing" placeholder="审核类型"></picker-view>
                </el-form-item>
                <el-form-item>
                    <el-select v-model="query.status" clearable placeholder="择审核状态">
                        <el-option label="待审核" :value="0"></el-option>
                        <el-option label="审核通过" :value="1"></el-option>
                        <el-option label="审核驳回" :value="2"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-input v-model="query.keyword" placeholder="审核号" clearable></el-input>
                </el-form-item>
                <el-button type="primary" native-type="submit" @click="doSearch">搜索</el-button>
            </el-form>
        </div>

        <div class="right">

        </div>
    </div>

    <el-table ref="tableView" height="tableHeight" class="page-body" :data="listData" border>
        <el-table-column label="审核状态" align="center" width="100">
            <template slot-scope="scope">
                <el-button type="primary" @click="showAuditDetail(scope.row.audit_no)">{{ scope.row.status_text }}</el-button>
            </template>
        </el-table-column>
        <el-table-column label="审核编号" prop="audit_no"></el-table-column>
        <el-table-column label="审核类型" prop="audit.tag.title"></el-table-column>
        <el-table-column label="所属公司" prop="audit.company.title"></el-table-column>
        <el-table-column label="审核人" prop="auditor.realname"></el-table-column>
        <el-table-column label="发起人" prop="audit.creator.realname"></el-table-column>
        <el-table-column label="发起时间" prop="create_time"></el-table-column>
        <el-table-column label="订单性质" prop="audit.order.order_type_text"></el-table-column>
        <el-table-column label="预产期" prop="audit.order.event_date"></el-table-column>
        <el-table-column label="酒店" prop="audit.order.store.title"></el-table-column>
        <el-table-column label="客户姓名" prop="audit.order.bridegroom"></el-table-column>
        
    </el-table>

    <div class="page-foot">
        <div class="left"></div>
        <div class="right">
            <common-pagination :total="pg.total" :page.sync="pg.page" :limit.sync="pg.limit" @getList="getTableData"></common-pagination>
        </div>
    </div>

    <detail-vue ref="auditDetailRef"></detail-vue>
</div>
</template>

<script>
import pagination from "@/components/mixins/pagination.vue";

import {
    getPageApi
} from '@/api/audit/index';

import pickerView from "@/components/picker/select.vue";
import detailVue from './detail.vue';

const query = {
    user_id: [],
    type: '',
    company_id: '',
    status: '',
    audit_type: '',
    keyword: ''
};

export default {
    components: {
        pickerView,
        detailVue
    },
    mixins: [pagination],
    provide() {
        return {
            listVue: this
        }
    },
    data() {
        return {
            query: Object.assign({}, query), // 搜索条件
            pagination: Object.assign({}, pagination),
            listData: [],
        }
    },
    created() {
        this.getTableData();
    },
    methods: {
        getTableData() {
            let params = {
                ...this.query,
            };
            params["pagination"] = this.pg;

            getPageApi(params).then(res => {
                this.listData = res.data.list;
                this.setPg(res);
            })
        },
        doSearch() {
            this.resetPg();
            this.getTableData();
        },
        showAuditDetail(audit_no) {
            this.$refs['auditDetailRef'].showDrawer(audit_no)
        }

    }
}
</script>

<style>

</style>
